<template>
    <view class="container">
        <view class="auth">
            <view class="left">
                <image :src="LoginAuth.avatar_cdn" />
            </view>

            <view class="right">
                <text>{{ LoginAuth.nickname ? LoginAuth.nickname : LoginAuth.username }}</text>
            </view>
        </view>
        <view class="list">
            <view class="item" hover-class="checkActive" @click="setWhitelist">
                <view class="title">
                    设置白名单
                </view>
                <view>
                    <image src="/static/images/right-arrow.png" alt="" />
                </view>
            </view>

            <view class="item" hover-class="checkActive" @click="getNoticeStatus">
                <view class="title">
                    设置通知使用权限
                </view>
                <view>
                    <image src="/static/images/right-arrow.png" alt="" />
                </view>
            </view>

            <view class="item" hover-class="checkActive" @click="onLogout">
                <view class="title">
                    退出当前账号
                </view>
                <view>
                    <image src="/static/images/right-arrow.png" alt="" />
                </view>
            </view>
        </view>
    </view>
</template>

<script>
// 引入监听插件
const NoticeBarModule = uni.requireNativePlugin('lu-NoticeBarModule');
export default {
    data() {
        return {
            LoginAuth:{}
        }
    },
    methods: {
        // 设置白名单
        setWhitelist() {
            // 获取白名单状态
            let status = NoticeBarModule.isIgnoringBatteryOptimizations();

            // 如果状态值为true，那么说明已经设置好了
            if(status === true)
            {
                this.$Tools.ToastSuccess('您已设置白名单，无须重复设置白名单');
                return false;
            }

            // 调用手机系统的白名单界面
            NoticeBarModule.requestIgnoreBatteryOptimizations();
        },
		// 退出登录
		onLogout()
		{
			uni.showModal({
                title:'退出登录',
                content:'确认退出当前账号？',
                showCancel:true,
                success:(res) => {
                    // 如果该属性为true，说明点击确认按钮
                    if(res.confirm === true)
                    {
                        this.$Tools.ToastSuccess({
                            title:'退出当前成功',
                            success:() => {
                                // 清除本地存储
                                uni.removeStorageSync('LoginAuth');

                                uni.removeStorageSync('gateway');

                                setTimeout(() => {
                                    uni.redirectTo({
                                        url:'/pages/login/login'
                                    });
                                },1500);
                            }
                        });

                        return false;
                    }
                }
            });
		},
        getNoticeStatus()
        {
            // 获取通知栏内容权限状态
            // let NoticeStatus = NoticeBarModule.readNotificationBar();

            // 调用手机系统的设置界面
            NoticeBarModule.toSetting();
        }
    },
    onShow()
    {
        // 把this存起来
        let that = this;

        uni.getNetworkType({
			success: function (res) {
				if(res.networkType === 'none')
				{
					that.$Tools.ToastError('请先连接网络或者打开移动网络');

					return;
				}
			}
		});

        let LoginAuth = this.$Tools.authCheck(true);

        if(LoginAuth === false) return;

        this.LoginAuth = LoginAuth;
    }
}
</script>

<style>
page{
    background: #f1f1f1;
}

.auth{
    display: flex;
    justify-content: space-around;
    padding: 30px 0;
    align-items: center;
    align-content: center;
    margin-bottom: 10px;
    background: #fff;
}

.auth > .left > image
{
    width: 120px;
    height: 120px;
    border-radius: 50%;
}

.auth > .right text{
    font-size: 28px;
    font-weight: bold;
}

.list{
    background-color: #fff;
}

.list > .item{
    padding: 10px;
    border-bottom: 1px solid #ccc;
    display: flex;
    justify-content: space-between;
}

.list > .item image{
    width: 18px;
    height: 18px;
    line-height: 43px;
}

.checkActive{
    background-color: rgba(233, 233, 233, 0.5);
}
</style>